<style lang="less" src="../static/css/init.css"></style>
<style lang="less" src="../static/css/icon.css"></style>
<template>
  <div id="app">
    <div class="wrap">
      <nav-header :rootInfo="rootInfo" v-show="rootInfo.showHeader || !rootInfo.isPhone" @showLogin="showLoginWay" ></nav-header>
      <router-view :rootInfo="rootInfo" class="router-box" @showLogin="showLoginWay"></router-view>
      <nav-footer :rootInfo="rootInfo" v-show="rootInfo.showFooter || !rootInfo.isPhone"></nav-footer>
      <!--<login v-show="show"></login>-->
      <login v-show="show" @showLogin="showLoginWay"></login>
    </div>
  </div>
</template>
<script>
import NavHeader from './components/NavHeader.vue'
import NavFooter from './components/NavFooter.vue'
import Login from './components/Login.vue'

export default {
  data() {
    return {
      show: false
    }
  },
  props: ['rootInfo'],
  name: 'app',
  components: {
    NavHeader,
    NavFooter,
    Login
  },
  methods: {
    showLoginWay(val) {
      const self = this;
      self.show = val
    },
  },
  mounted() {
    var _self=this;
    function setRem(num) {
      var windowWidth = document.body.offsetWidth < window.screen.width ? document.body.offsetWidth : window.screen.width;
      var RootFontSize = windowWidth / 750 * num;
      document.getElementsByTagName("html")[0].style.fontSize = RootFontSize + "px";
    }
    function setView() {
      var viewport = document.getElementById('viewport');
      if (viewport) viewport.parentNode.removeChild(viewport);
      document.getElementsByTagName("html")[0].style = '';
      if (document.body.offsetWidth <= 829 || window.screen.width <= 829) {
        _self.rootInfo.isPhone = true;
        var oMeta = document.createElement('meta');
        oMeta.name = 'viewport';
        oMeta.id = 'viewport';
        var num = 100;
        if (window.navigator.appVersion.match(/iphone/gi)) {
          oMeta.content = 'initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no';
          num = 200
        } else {
          oMeta.content = 'initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no';
        }
        document.getElementsByTagName('head')[0].appendChild(oMeta);
        setRem(num)
      } else {
        document.getElementsByTagName("html")[0].style = 'min-width:1024px;font-size:12px;';
      }
    }
    setView();
//    window.onresize = function() {
//      setTimeout(setView, 10)
//    }

    var isWeixin=false
    var ua = window.navigator.userAgent.toLowerCase();
//    console.log(ua);//mozilla/5.0 (iphone; cpu iphone os 9_1 like mac os x) applewebkit/601.1.46 (html, like gecko)version/9.0 mobile/13b143 safari/601.1
    if (ua.match(/MicroMessenger/i) == 'micromessenger') {
      isWeixin= true;
    } else {
      isWeixin= false;
    }
    if (!this.$bw.getStorage("userInfo")&&isWeixin&&(this.$bw.getUrlInfo('token')==null ||this.$bw.getUrlInfo('token')==''||this.$bw.getUrlInfo('token')=='undefined')) {

      window.location.href='http://weixin.cdtx.org/index.html#/otherLogin'

    }
  }
}

</script>
<style scoped lang="less">
@media screen and (max-width: 829px) {
  #app .router-box {
    min-height: calc(~"100% - 4.06rem");
    width: 100%;
  }
}

@media screen and (min-width: 829px) {
  #app .router-box {
    min-height: calc(~"100% - 22.5rem") !important;
    width: 100%;
  }
}

#app {
  height: 100%;
  width: 100%;
  .wrap {
    height: 100%;
    width: 100%;
    margin: 0 auto;
  }
}

</style>
